<template>
  <div class="hello" v-on:ee="preven">
    HelloWorld
    {{this.str}}
    <button @click="add">add</button>
    <button @click="chickrandim(111)">chickrandim</button>
  </div>
</template>

<script>
import {mapState,mapActions} from "vuex"
export default {
  name: "HelloWorld",
  data() {
    return {
      msg: "Welcome to Your Vue.js App",
      datas:this.data
    };
  },
  created() {
    console.log("created")
  },
  mounted() {
    console.log("mounted");
  },
  computed: {
    ...mapState(["str"]),
  },
  methods: {
    preven(str) {
      console.log(str);
    },
    add(){
      this.$store.commit("addlist")
    },
    ...mapActions(["chickrandim"])
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="stylus" scoped>
@import '~assets/visbae.stylus';

.hello {
  color: $color;
}
</style>

